<template>
  <div class="chemical">
    <div class="add" @click="addCheckList()">添加检查表</div>
    <eagle-list ref="eagleList" :tabData="tabData" @bindData="bindData">
      <eagle-cell v-for="(item, index) in list" :key="index" class="card">
        <eagle-tag v-if="item.Status < 10" class="info_tag" type="primary"
          >未完成</eagle-tag
        >
        <eagle-tag v-if="item.Status == 10" class="info_tag" type="warning"
          >已完成</eagle-tag
        >
        <div>
          <div @click="goDetail(item)">
            <div class="ch_header">
              <div>{{ index + 1 }}、{{ item.TName }}</div>
            </div>
            <van-row class="ch_row">
              <van-col span="12" class="ch_col">
                <img
                  src="@/assets/Images/AppIcon/icon_equ_supplier.png"
                  alt=""
                />
                <div>{{ item.CreateChnName }}</div>
              </van-col>
              <van-col span="12" class="ch_col">
                <img
                  src="@/assets/Images/AppIcon/icon_list_danger.png"
                  alt=""
                />
                <div>{{ item.CreateDate }}</div>
              </van-col>
            </van-row>
            <van-row class="ch_row">
              <img src="@/assets/Images/AppIcon/icon_equ_property.png" alt="" />
              <div>来源：{{ item.FromType == 0 ? "检查人添加" : "" }}</div>
            </van-row>
          </div>
          <template v-if="item.Status < 10">
            <eagle-divider />
            <div class="dep_btm">
              <div class="btm_item" @click="handleDelete(item)">
                <img src="@/assets/Images/AppIcon/icon_delete.png" alt="" />
                <div class="mr-10">删除该检查表</div>
              </div>
            </div>
          </template>
        </div>
      </eagle-cell>
    </eagle-list>
    <!--检查表选择-->
    
    <danger-template-choose-dialog
      title="选择检查表"
      :show.sync="showadd"
      :tagData="tagData"
      @callback="dangerTemplateCallback"
      :isMulti="true"
      :tab="true"
    ></danger-template-choose-dialog>
  </div>
</template>

<script>
import { mapGetters } from "vuex";
import { Dialog } from "vant";
import DangerTemplateChooseDialog from "@/views/components/danger/dangerTemplateChooseDialog.vue";
export default {
  components: {
    DangerTemplateChooseDialog,
  },
  data() {
    return {
      loading: false,
      finished: false,
      value: "",
      list: [],
      showadd: false,
      tabData:[{
        url:"/OtherDangerCheckTask/GetTemplateList",
        isPage:false,
        params:{
          ctCode:this.$route.query.ctCode
        }
      }],
      tagData:[]
    };
  },
  computed: {
    ...mapGetters(["CompanyCode"]),
  },
  created() {
    //this.getList();
  },
  methods: {
    bindData(data){
      this.list = data;
    },
    dangerTemplateCallback(data) {
      let codeArr = [];
      let nameArr = [];
      if(data.length>0){
        for(var i=0;i<data.length;i++){
          codeArr.push(data[i].TCode);
          nameArr.push(data[i].Title);
        }
      }
      let params= {
        ctCode: this.$route.query.ctCode,
        tCodes: codeArr.join(),
        tNames: nameArr.join(),
      };

      let _this=this;
      _this.$axios
      .post("/OtherDangerCheckTask/AddTemplateToCheckTask",params)
      .then((res)=>{
        _this.$refs.eagleList.getList();
      })
      _this.showadd=false;
    },
    handleDelete(item) {
      Dialog.confirm({
        title: "询问",
        message: "确定要删除改任务的检查表吗?",
      })
        .then(() => {
          // on confirm
          let _this=this;
          _this.$axios
          .get("/OtherDangerCheckTask/DeleteTemplate",{params:{id: item.ID}})
          .then((res)=>{
             _this.$toast.success("删除成功！");
             _this.$refs.eagleList.getList();
          })
        })
        .catch(() => {
          // on cancel
        });
    },
    goDetail(item) {
      if (item.Status == 10) {
        this.$router.push({
          path: "/OtherDanger/DangerTemplateCheckResult",
          query: {
            tCode: item.TCode,
            tRand: item.TRand,
          },
        });
      } else {
        this.$router.push({
          path: "/OtherDanger/DangerTemplateDetail",
          query: {
            tCode: item.TCode,
            tRand: item.TRand,
            CompanyCode: this.CompanyCode,
            ctCode: this.$route.query.ctCode,
          },
        });
      }
    },
    // 详情
    addCheckList(ChemCode) {
      this.showadd = true;
      // this.$router.push({
      //   path: "/Danger/AddMyCheckList",
      //   query: { ctCode: this.$route.query.ctCode },
      // });
    }
  },
};
</script>

<style lang="less" scoped>
.chemical {
  background-color: #e8f1f8;

  .info_search {
    padding: 10px;
    border-radius: 5px !important;

    .van-field__control {
      background-color: #ffffff !important;
    }
  }
}

.chemical_item {
  position: relative;
  padding: 10px;
}

.ch_header {
  display: flex;
  justify-content: space-between;
  position: relative;
  margin-bottom: 10px;
}

.ch_row {
  display: flex;
  align-items: center;
  margin-bottom: 5px;
  img {
    height: 15px;
    width: 15px;
    margin-right: 5px;
  }
  .ch_col {
    display: flex;
    align-items: center;
  }
}

.dep_btm {
  display: flex;
  justify-content: flex-end;

  .btm_item {
    display: flex;
    align-items: center;
    img {
      height: 15px;
      width: 15px;
      margin-right: 5px;
    }
  }
}

.van-divider {
  margin-top: 0px;
  margin-bottom: 0px;
}
</style>
